<!DOCTYPE html>
<html>
<body>
<p>Create a 50*50 pixels imagedata object where every pixel is red:</p>
<canvas id="myCanvas" width="400" height="350" style="border:1px solid #d3d3d3;"> your browser does not support the canvas tag </canvas>
<script type="text/javascript">

var c		= document.getElementById	("myCanvas");
var ctx		= c.getContext				("2d");
var imgData	= ctx.createImageData		(320,240);

for (i=0; i<imgData.width*imgData.height*4;i+=4)
{
  imgData.data[i+0]=255;
  imgData.data[i+1]=i%255;
  imgData.data[i+2]=0;
  imgData.data[i+3]=255;
}
ctx.putImageData(imgData,10,10);

</script>
</body>
</html>
